<template>
  <a-card :bordered="false">

     <!-- 详情列表 -->

     <template>
  <a-descriptions title="客户详情">

    <a-descriptions-item label="客户名称">
      {{companyName}}
    </a-descriptions-item>
    <a-descriptions-item label="客户类型">
      {{customertype}}
    </a-descriptions-item>
	<a-descriptions-item label="月结额度">
	 {{monthLines}}
	</a-descriptions-item>
    <a-descriptions-item label="剩余额度">
     {{remainingLimit}}
    </a-descriptions-item>
	<a-descriptions-item label="结算方式">
	 {{customertype}}
	</a-descriptions-item>
    <a-descriptions-item label="客户编号">
     {{companyCode}}
    </a-descriptions-item>
    <a-descriptions-item label="联系人">
     {{aboutPerson}}
    </a-descriptions-item>

<a-descriptions-item label="联系电话">
	 {{aboutPhone}}
	</a-descriptions-item>

	<a-descriptions-item label="账户余额">
	 {{accountBalance}}
	</a-descriptions-item>

	<a-descriptions-item label="地址">
	 {{address}}
	</a-descriptions-item>
	<a-descriptions-item label="备注">
	 {{remark}}
	</a-descriptions-item>

<!-- 	<a-descriptions-item label="营业执照">
	<img :src="businessLicense" />
	</a-descriptions-item> -->

  </a-descriptions>
  <p v-if="this.businessLicense!=null&&this.businessLicense!=''">营业执照</p>
<img v-if="this.businessLicense!=null&&this.businessLicense!=''" :src="businessLicense" style="width: 200px;height: 200px;" />

  <!-- <a-button @click="setyuejiewindow" type="primary" style="color: #F9D532;width: 80px;height: 36px;background: #333333;border-style: none;float: right;">设置月结</a-button> -->
</template>

    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <template>
      <div class="container">
<!--        <div class="top">-->
<!--          <div class="wid" style="float: left;">-->
<!--           -->
<!--            &lt;!&ndash;            <a href="#"><i class="el-icon-arrow-left"></i>返回</a>&ndash;&gt;-->
<!--          </div>-->
<!--        </div>-->
        <div class="order" style="margin-top: 20px">
          <div class="wid" style="float: left">
            <span @click="bubu(1)">业务流水</span>
			      <span @click="bubu(5)">售后流水</span>
            <span @click="bubu(2)">员工列表</span>
            <span @click="bubu(3)">门店列表</span>
            <span @click="bubu(4)">品牌标列表</span>

    <!-- <a-tabs  >
   <a-tab-pane tab="业务流水"  @click="bubu(1)"></a-tab-pane>
  <a-tab-pane tab="员工列表" @click="bubu(2)"></a-tab-pane>
  <a-tab-pane tab="门店列表" @click="bubu(3)"></a-tab-pane>
  <a-tab-pane tab="品牌标列表" @click="bubu(4)"></a-tab-pane>
</a-tabs> -->

          </div>
        </div>
      </div>
    </template>
    <template>
      <div class="ant-alert ant-alert-info"
           style="margin-bottom: 5px;height:50px;background-color: #ffffff;margin-top: 100px;border: none;">
      </div>
    </template>

    <div>
      <div class="ant-alert ant-alert-info"
           style="margin-bottom: 10px;height: 40px;border: none;background-color: #ffffff;margin-top: -50px">
        <h4 class="anticon anticon-info-circle ant-alert-icon" style="color: #000c17;margin-top: 10px;border: none;">
          {{neirong}}</h4>
      </div>

      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
               :pagination="ipagination"
               :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               class="j-table-force-nowrap"
               @change="handleTableChange" style="margin-left: 10px;margin-right: 20px;" v-show="this.tabs==1">



        <template slot="htmlSlot" slot-scope="text">
          <div v-html="text"></div>
        </template>
        <template slot="imgSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" height="25px" alt=""
               style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="uploadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
                   <a v-if="record.isAfter==0" @click="see_orderDetail(record.orderSn,record.type)">查看订单详情</a>
        </span>
      </a-table>

      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns2" :dataSource="dataSource"
               :pagination="ipagination"
               :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               class="j-table-force-nowrap"
               @change="handleTableChange" style="margin-left: 10px;margin-right: 20px;" v-show="this.tabs==2">

        <template slot="htmlSlot" slot-scope="text">
          <div v-html="text"></div>
        </template>
        <template slot="imgSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" height="25px" alt=""
               style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="uploadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
          <!--          <a @click="see_companyDetail(record.id)">查看</a>-->
        </span>

      </a-table>

      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns3" :dataSource="dataSource"
               :pagination="ipagination"
               :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               class="j-table-force-nowrap"
               @change="handleTableChange" style="margin-left: 10px;margin-right: 20px;" v-show="this.tabs==3">



        <template slot="htmlSlot" slot-scope="text">
          <div v-html="text"></div>
        </template>
        <template slot="imgSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" height="25px" alt=""
               style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="uploadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
          <!--          <a @click="see_companyDetail(record.id)">查看</a>-->
        </span>
      </a-table>


      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns4" :dataSource="dataSource"
               :pagination="ipagination"
               :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               class="j-table-force-nowrap"
               @change="handleTableChange" style="margin-left: 10px;margin-right: 20px;" v-show="this.tabs==4">

        <template slot="htmlSlot" slot-scope="text">
          <div v-html="text"></div>
        </template>
        <template slot="imgSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" height="25px" alt=""
               style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="uploadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
          <!--          <a @click="see_companyDetail(record.id)">查看</a>-->
        </span>
      </a-table>

      <!-- 劳务公司记录 -->
      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns5" :dataSource="dataSource"
               :pagination="ipagination"
               :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               class="j-table-force-nowrap"
               @change="handleTableChange" style="margin-left: 10px;margin-right: 20px;" v-show="this.tabs==5">

        <template slot="htmlSlot" slot-scope="text">
          <div v-html="text"></div>
        </template>
        <template slot="imgSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" height="25px" alt=""
               style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="uploadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
          <!--          <a @click="see_companyDetail(record.id)">查看</a>-->
        </span>
      </a-table>
    </div>
      <!-- 表单区域 -->
    <jeecgDemo-modal ref="modalForm2" @ok="chongzhi"></jeecgDemo-modal>

    <!-- 一对多表单区域 -->
    <!-- <JeecgDemoTabsModal ref="jeecgDemoTabsModal" @ok="modalFormOk"></JeecgDemoTabsModal> -->

  <lgyxTrainData-modalZ ref="modalForm" @aaa="getdetaildata" @ok="modalFormOk"></lgyxTrainData-modalZ>
  </a-card>
</template>

<script>
import lgyxTrainDataModalZ from './modules/LgyxTrainDataModalZ'
  import JeecgDemoModal from './modules/JeecgDemoModal'
  import '@/assets/less/TableExpand.less'
  import '@/assets/less/style.min.css'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import {
    mixinDevice
  } from '@/utils/mixin'

  import {
    query_companydetailinfo
  } from '@/api/api'
  import {
    query_companyjiedaninfo
  } from '@/api/api'
  import {
    query_company_commissionlist
  } from '@/api/api'
  import {
    deleteAction,
    getAction,
    putAction,
    postAction,
    downFile,
    getFileAccessHttpUrl
  } from '@/api/manage'

  export default {
    name: 'companyDetail',
    mixins: [JeecgListMixin, mixinDevice],
    components: {
       lgyxTrainDataModalZ,

   JeecgDemoModal
    },
    data () {
      return {
		  businessLicense:'',
				remark:'',
		  address:'',
		  accountBalance:'',
		  remainingLimit:'',
        userId:"",
          customertype:'',
        companyName:'',
        companyCode:'',
        aboutPerson:'',
        aboutPhone:'',
        monthLines:'',
        description: 'lgyx_pickorder_info管理页面',
        companyDetailbyid: [],
        sexl: '',
        usersource: '',
        certification: '',
        tabs: 1,
        neirong: '业务流水',
        dictOptions: {},
        dataSource: [],
        shinumber: 0,
        columns: [
           {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: "center",
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },
          {
          title: '订单编号',
          align: 'center',
          dataIndex: 'orderSn'
        },

          {
            title: '创建时间',
            align: 'center',
            dataIndex: 'createTime'
          },
          {
            title: '业务类型',
            align: "center",
            dataIndex: 'type',
              customRender: (type) => {
              //字典值替换通用方法
              if(type==0)
              return "面料订单";
              else if(type==1)
              return "个订订单";
              else if(type==2)
              return "团订订单";
              else
              return "成衣订单";
            }
			},

			{
			  title: '订单状态',
			  align: "center",
			  dataIndex: 'status',
			    customRender: (status) => {
			    //字典值替换通用方法
			    if(status==0)
			    return "未支付";
			    else
			    return "已支付";
			  }
			  },

          {
            title: '订单金额',
            align: 'center',
            dataIndex: 'costMoney'
          },
        {
        			  title: '操作',
        			  dataIndex: 'action',
        			  align: "center",
        			  scopedSlots: {
        			    filterDropdown: 'filterDropdown',
        			    filterIcon: 'filterIcon',
        			    customRender: 'action'},

        },

        ],
        columns2: [

           {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: "center",
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },{
          title: '员工名称',
          align: 'center',
          dataIndex: 'realName'
        },
          {
            title: '员工编号',
            align: 'center',
            dataIndex: 'workNumber'
          },

          {
            title: '所属门店',
            align: 'center',
            dataIndex: 'storeName'
          },

          {
            title: '联系电话',
            align: 'center',
            dataIndex: 'phone'
          },
           {
            title: '登录账号',
            align: 'center',
            dataIndex: 'userName'
          },

        ],

        columns3: [
           {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: "center",
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },
          {
          title: '门店名称',
          align: 'center',
          dataIndex: 'storeName',

        },
          {
            title: '门店编号',
            align: 'center',
            dataIndex: 'storeCode'
          },
          {
            title: '门店地址',
            align: 'center',
            dataIndex: 'storeAddress'
          },
          {
            title: '联系电话',
            align: 'center',
            dataIndex: 'phone',

          },
        ],

        columns4: [
     {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: "center",
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },

          {
            title: '品牌标志名称',
            align: 'center',
            dataIndex: 'pingpai_name'
          },
          {
            title: '创建时间',
            align: 'center',
            dataIndex: 'create_time'
          },



        ],
       columns5: [
     {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: "center",
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },

          {
            title: '订单编号',
            align: 'center',
            dataIndex: 'orderSn'
          },
		  {
		    title: '金额',
		    align: 'center',
		    dataIndex: 'costMoney'
		  },
          {
            title: '创建时间',
            align: 'center',
            dataIndex: 'createTime'
          },
        ],

        url: {
           detail:"/Finance/getcompanydetail",
           list: "/Finance/getCompanyBusinessList?companyCode="+this.$route.query.companyCode+"&isAfter=0",
           rollbackMoney:"/Finance/rollbackMoney"
        },
      }
    },
    created () {
      this.userId=this.$route.query.userId;
      this.getdetaildata();
    },
    computed: {
      importExcelUrl: function () {
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
      },
    },
    methods: {

		see_orderDetail(orderSn,type){
			if(type==0){
				this.$router.push({path:'/orderCenter/fabricDetail',query: {order:orderSn}})
			}else if(type==1){
				this.$router.push({path:'/orderCenter/singleDetail',query: {order:orderSn}})
			}else if(type==2){
				this.$router.push({path:'/orderCenter/teamDetail',query: {order:orderSn}})
			}
		},
    getdetaildata(){
			getAction(this.url.detail,{"companyCode":this.$route.query.companyCode}).then((res)=>{
			       if(res.success){
			         this.customertype=res.result.ismouthString;
			         this.companyName=res.result.companyName;
			         this.companyCode=res.result.companyCode;
			         this.aboutPerson=res.result.aboutPerson;
			         this.aboutPhone=res.result.aboutPhone;
			         this.monthLines=res.result.monthLines;
						   this.remainingLimit=res.result.remainingLimit;
						   this.accountBalance=res.result.accountBalance;
							 this.address=res.result.address;
						   this.remark=res.result.remark;
							  this.businessLicense=res.result.businessLicense;
			       }else{
			         this.$message.warning(res.message);
			       } })
		},

        //打开设置月结的窗口
    setyuejiewindow: function () {
      this.$refs.modalForm.edit(this.$route.query.userId);
      this.$refs.modalForm.title = "设置月结";
      this.$refs.modalForm.disableSubmit = false;
    },
      bubu (e) {
        this.total = 0
        this.tabs = e
        this.ipagination.current=1;
        if (this.tabs == 1) {
          let params = this.$route.query.companyCode
          this.neirong = '业务流水'
          this.url.list = '/Finance/getCompanyBusinessList?companyCode=' + params+"&isAfter=0"

          // let params = this.$route.query.companyCode
          // getAction('/Finance/getCompanyBusinessList', {
          //   companyCode: params,isAfter:0
          // }).then((res) => {
          //   if (res.success) {
          //     this.url.list = '/Finance/getCompanyBusinessList?companyCode=' + params+"&isAfter=0"
          //   }
          // })
        }
		else if (this.tabs == 5) {
		  this.neirong = '售后流水'
		  let params = this.$route.query.companyCode
      this.url.list = '/Finance/getCompanyBusinessList?companyCode=' + params+"&isAfter=1"
		  // getAction('/Finance/getCompanyBusinessList', {
		  //   companyCode: params,isAfter:1
		  // }).then((res) => {
		  //   if (res.success) {
		  //      this.url.list = '/Finance/getCompanyBusinessList?companyCode=' + params+"&isAfter=1"
		  //   }
		  // })
		}else if (this.tabs == 2) {
          this.neirong = '员工列表'
          let params = this.$route.query.companyCode
          this.url.list = '/Finance/getcompanystaff?companyCode=' + params
          // getAction('/Finance/getcompanystaff', {
          //   companyCode: params
          // }).then((res) => {
          //   if (res.success) {
          //     this.url.list = '/Finance/getcompanystaff?companyCode=' + params
          //   }
          // })
        } else if (this.tabs == 3) {
          this.neirong = '门店列表'
          let params = this.$route.query.id
          this.url.list = '/Finance/getcompanystore?companyId=' + params
          // getAction('/Finance/getcompanystore', {
          //   companyId: params
          // }).then((res) => {
          //   this.loading = false
          //   if (res.success) {
          //     this.url.list = '/Finance/getcompanystore?companyId=' + params
          //   }
          // })
        } else if (this.tabs == 4) {
          this.neirong = '品牌标列表'
         let params = this.$route.query.id
          this.url.list = '/Finance/getcompanylabel?companyId=' + params
          // getAction('/Finance/getcompanylabel', {
          //   companyId: params
          // }).then((res) => {
          //   if (res.success) {
          //     this.url.list = '/Finance/getcompanylabel?companyId=' + params
          //   }
          // })
        }
        this.loadData();
      }
    }
  }
</script>
<style scoped>
  .cd {
    display: none;
  }

  .cs {
    display: block;
  }

  @import '~@assets/less/common.less';
</style>
